<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@	taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:url var="queryPage" value="/tableStatus/queryPage.do" />
<c:url var="createTablePage" value="/tableStatus/createTablePage.do" />
<c:url var="dropTable" value="/tableStatus/dropTable.do" />
<c:url var="renameTable" value="/tableStatus/renameTable.do" />
<c:url var="createTable" value="/tableStatus/createTable.do" />

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Insert title here</title>
	<link rel="stylesheet" type="text/css" href="../common/easyui/themes/metro-green/easyui.css" />
	<link rel="stylesheet" type="text/css" href="../common/easyui/themes/icon.css" />
	<script type="text/javascript" src="../common/easyui/jquery.min.js"></script>
	<script type="text/javascript" src="../common/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../common/common.js"></script>
	<script type="text/javascript" src="../common/system.js"></script>
	<style type="text/css">
		html, body {
			height: 100%;
			padding: 0;
			margin: 0;
		}
	</style>
</head>

<body>
<!-- 表格 -->
<div id="dg_tableStatus"></div>
<!-- 表格上的工具栏 -->
<div id="toolbar_tableStatus" style="padding-left:5px; height:30px;">
	<div style="margin-bottom: 5px;">
		<a href="javascript:newTable();" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">创建表</a>
		<a href="javascript:deleteTable();" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true">删除表</a>
		<a href="javascript:newName();" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">重命名</a>
		<a href="javascript:reload(initTableStatusGrid);" class="easyui-linkbutton" data-options="iconCls:'icon-reload',plain:true">刷新</a>
	</div>
</div>

<!-- “创建”对话框 -->
<div id="dialog_createTable" style="width:1200px;height:500px;"></div>

<!-- “重命名”对话框 -->
<div id="dialog_renameTable" class="easyui-dialog" data-options="closed: true" style="width:300px;height:150px;">
	<div id="dg_renameTable"></div>
	<div id="toolbar_renameTable">
		<div style="margin-bottom: 5px;">
			<a href="javascript:endEdit('dg_renameTable', enableReNameExecute);" class="easyui-linkbutton" data-options="iconCls:'icon-ok',plain:true">完成</a>
			<a href="javascript:reject('dg_renameTable');" class="easyui-linkbutton" data-options="iconCls:'icon-arrow-undo',plain:true">清空</a>
			<a href="javascript:renameTable();" class="easyui-linkbutton" data-options="iconCls:'icon-execute',plain:true,disabled:true">执行</a>
		</div>
	</div>
</div>

<!-- JS脚本 -->
<script type="text/javascript">
$(function(){
	// 选项卡切换时产生位置回退，但不作回退操作，只有单击链接或树形列表才做回退操作
	if(loc[2] != ''){
		// 初始化表格
		initTableStatusGrid();
		// 初始化重命名对话框
		initRenameTableGrid();
		// 初始化创建对话框
		initCreateTableDialog();
	} else{
		// 初始化当前位置
		var success = initLocation("${serverName}", "${databaseName}");
		if(success){
			// 初始化表格
			initTableStatusGrid();
			// 初始化重命名对话框
			initRenameTableGrid();
			// 初始化创建对话框
			initCreateTableDialog();
			// 更新当前位置显示
			updateTitle('database');
		} else{
			alertErrorMsg();
		}
	}
});

// 初始化数据库表格
function initTableStatusGrid(){
	initDG('dg_tableStatus', 'toolbar_tableStatus', '${queryPage}', {
		serverName : loc[0],
		databaseName : loc[1]
	});
}

// 初始化重命名对话框
function initRenameTableGrid(){
	// 开启表格的单元格编辑功能
	$('#dg_renameTable').datagrid().datagrid('enableCellEditing');
	// 加载表格数据
	$('#dg_renameTable').datagrid({
		fitColumns:true,
		fit:true,
		toolbar:'#toolbar_renameTable',
		columns:[[
			{field:'oldName',width:100,title:'原名称'},
			{field:'newName',width:100,title:'新名称',editor:'text',styler:valueCellStyler}
		]],
		onClickRow : function(rowIndex, rowData){
			// 如果执行按钮可用，则设置为不可用
			if(!$('#toolbar_renameTable a:eq(2)').linkbutton('options').disabled){
				disableLinkBtn($('#toolbar_renameTable a:eq(2)'));
			}
		}
	});
}

//初始化创建表的对话框
function initCreateTableDialog(){
	$('#dialog_createTable').dialog({
	    closed: true,
	    modal: true
	});
}

// 打开创建表的对话框
function newTable(){
	// 设置添加对话框界面的url
	var createTablePageUrl = '${createTablePage}?serverName=' + loc[0] + "&databaseName=" + loc[1];
	// 更新对话框界面
	$('#dialog_createTable').dialog({'href':createTablePageUrl});
	// 打开对话框
	openDialog('dialog_createTable', '创建表');
	// 清空表格选择
	clearSelections('dg_tableStatus');
	// 设置请求URL
	url_edit = '${createTable}';
}

// 打开重命名表的对话框
function newName(){
	var row = $('#dg_tableStatus').datagrid('getSelected');
	if(row){
		// 打开对话框
		openDialog('dialog_renameTable', '重命名表格');
		// 设置请求URL
		url_edit = '${renameTable}';
		// 设置默认值
		var data = $('#dg_renameTable').datagrid('getData');
		data.total=1;
		data.rows=[{"oldName":row.TABLE_NAME, "newName":''}];
		$('#dg_renameTable').datagrid('loadData',data);
	} else{
		$.messager.alert("提示",'请选中要重命名的表格！');
	}
}

// 重命名一张表
function renameTable(){
	var rows = $('#dg_renameTable').datagrid('getChanges');
	if(rows.length > 0){
		// 发送AJAX请求
		$.ajax({
			type : 'post',
			url : '${renameTable}',
			data : {
				serverName:loc[0],
				databaseName:loc[1],
				newName:rows[0].newName,
				oldName:rows[0].oldName
			},
			dataType : 'json',
			success : function(data){
				if(data.success){
					$.messager.alert('成功', data.message);
					closeDialog('dialog_renameTable');
					// 重新载入树形列表
					reload(initDatabaseTree);
					// 重新载入当前表格
					reload(initTableStatusGrid);
					// 更新当前位置
					if(loc[2] == rows[0].oldName){
						initLocation(loc[0], loc[1]);
						updateTitle('database');
						$('#tabs').tabs('disableTab', 3);
						$('#tabs').tabs('disableTab', 4);
					}
				} else{
					$.messager.alert("失败", data.message + "<br>" + data.data);
				}
			}
		});
	} else{
		disableReNameExecute();
	}
}

//使重命名的执行按钮可用
function enableReNameExecute(){
	enableLinkBtn($('#toolbar_renameTable a:eq(2)'));
}

//使执行按钮不可用
function disableReNameExecute(){
	disableLinkBtn($('#toolbar_renameTable a:eq(2)'));
}

// 删除一张表
function deleteTable(){
	var row = $('#dg_tableStatus').datagrid('getSelected');
	if(row){
		$.messager.confirm('提示', '确认删除表：' + row.TABLE_NAME + ' ?', function(r){
			if(r){
				// 发送AJAX请求
				$.ajax({
					type : 'post',
					url : '${dropTable}',
					data : {
						serverName : loc[0],
						databaseName : loc[1],
						table_name : row.TABLE_NAME
					},
					dataType : 'json', 
					success: function(data){
						if(data.success){
							$.messager.alert('成功', data.message);
							// 重新载入树形列表
							reload(initDatabaseTree);
							// 重新载入当前表格
							reload(initTableStatusGrid);
							// 更新当前位置
							if(loc[2] == row.TABLE_NAME){
								initLocation(loc[0], loc[1]);
								updateTitle('database');
								$('#tabs').tabs('disableTab', 3);
								$('#tabs').tabs('disableTab', 4);
							}
						} else{
							$.messager.alert("失败", data.message + "<br>" + data.data);
						}
					}
				});
			}
		});
	} else{
		$.messager.alert("提示",'请选中要删除的表！');
	}
}
</script>
</body>
</html>